<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人简历</title>
    <link rel="stylesheet" href="advancedresume.css">

</head>

<body>
    <div id='top-line'></div>
    <div id='top-left-line'></div>
    <div id='top-right-line'></div>

    <img src='images/p1.jpg' alt="backgroundImage" id='background'>

    <div id='head-background'></div>

    <header>

        <div id='name-logo'>许晋源</div>

        <img src='images/那头猪.jpg' alt="头像" id="head-portrait">

        <div class='link'>
            <a href='#introduction'>个人介绍</a>
            <div class='line'></div>
            <a href='#project'>项目介绍</a>
            <div class='line'></div>
            <a href='#interaction'>给我留言</a>
        </div>

    </header>

    <section id='vision'>
        <h1>大数据工程师</h1>
        <p id='vision-text'>
            基本能力：</br>
            ★ 对分布式集群有一定的了解，熟悉并掌握独自搭建分布式集群</br>
            ★ 有云计算，分布式存储实战项目</br>
            ★ 熟悉构建后台服务器，有个人搭建网站的经历</br>
            ★ 熟悉linux，hadoop，hive，mysql等基本环境搭配和命令</br>
            ★ 熟悉使用python、c等基本语言</br>
            ★ 掌握计算机基础知识，深入理解数据结构，操作系统等计算机基础知识</br>
            ★ 有快速学习的能力、敢于探索新事物
        </p>
        <div id='img-Email'>
            <img src='images/Email.png' alt="img-Email">
            <p> dtxn_xjy@qq.com</p>
        </div>
        <div id='img-Phone'>
            <img src='images/Phone.png' alt="img-Phone">
            <p>+86 185 3649 6995</p>
        </div>
    </section>

    <section id='introduction'>

        <div id='introduction-skill'>

            <h1>技能掌握</h1>

            <div id='introduction-skill-block'>

                <div id='introduction-skill-text'>
                    <p>HTML</p>
                    <p>CSS</p>
                    <p>Mysql</p>
                    <p>C</p>
                    <p>linux</p>
                    <p>Python</p>
                    <p>Java</p>
                </div>

                <div class='introduction-skill-bar'>
                    <div id="introduction-skill-bar1"></div>
                    <div id="introduction-skill-bar2"></div>
                    <div id="introduction-skill-bar3"></div>
                    <div id="introduction-skill-bar4"></div>
                    <div id="introduction-skill-bar5"></div>
                    <div id="introduction-skill-bar6"></div>
                    <div id="introduction-skill-bar7"></div>
                    <div id="introduction-skill-bar8"></div>
                </div>

            </div>

        </div>

        <div id='introduction-experience'>

            <ul id="ul-experience-choose">
                <li id="li-experience-choose1"><a href="#">教育经历</a></li>
                <li id="li-experience-choose2"><a href="#">工作经历</a></li>
                <li id="li-experience-choose3"><a href="#">参赛经历</a></li>
            </ul>

            <div id="expreience1">

                <div class="experience-years">
                    <div class="years">
                        2003—2008
                    </div>
                    <div class="years-content">
                        幼儿园，没什么好说的
                    </div>
                </div>

                <div class="experience-years">
                    <div class="years">
                        2008—2013
                    </div>
                    <div class="years-content">
                        小学，红领巾
                    </div>
                </div>

                <div class="experience-years">
                    <div class="years">
                        2013—2016
                    </div>
                    <div class="years-content">
                        初中，学习ing
                    </div>
                </div>

                <div class="experience-years">
                    <div class="years">
                        2016—2019
                    </div>
                    <div class="years-content">
                        决战高考1095天！
                    </div>
                </div>

                <div class="experience-last">
                    <div class="years">
                        2019—至今
                    </div>
                    <div class="years-content">
                        <b>山西农业大学 软件工程（大数据方向）/本科</b></br>
                        </br>
                        <b>加权均分：</b> 85.57</br>
                        <b>GPA：</b> 3.49/4.3</br>
                        <b>专业排名：</b> 9/42</br>
                        </br>
                        <b>专业核心课程及分数：</b></br>
                        <span style="width:30px; display:inline-block"></span> 计算机网络(86.699)
                        <span style="width:30px; display:inline-block"></span> 操作系统(87.32)
                        <span style="width:30px; display:inline-block"></span> 数据结构(80.729)
                        </br>
                        <span style="width:30px; display:inline-block"></span> 区块链基础技术(82.0)
                        <span style="width:30px; display:inline-block"></span>数据挖掘(91.9)
                        <span style="width:30px; display:inline-block"></span>python程序设计(99.0)

                    </div>
                </div>

            </div>

            <div id="expreience2">

                <div class="experience-years">
                    <div class="years">
                        2002—2007
                    </div>
                    <div class="years-content">
                        好好学习中 -- 5年
                    </div>
                </div>

                <div class="experience-years">
                    <div class="years">
                        2007—2013
                    </div>
                    <div class="years-content">
                        好好学习中 -- 6年
                    </div>
                </div>

                <div class="experience-years">
                    <div class="years">
                        2013—2016
                    </div>
                    <div class="years-content">
                        好好学习中 -- 3年
                    </div>
                </div>

                <div class="experience-years">
                    <div class="years">
                        2016—2019
                    </div>
                    <div class="years-content">
                        好好学习中 -- 3年
                    </div>
                </div>

                <div class="experience-last">
                    <div class="years">
                        2019—至今 
                    </div>
                    <div class="years-content">
                        努力敲代码中ing -- 3年
                    </div>
                </div>

            </div>

            <div id="expreience3">

                <div class="experience-years">
                    <div class="years">
                        2001—2007
                    </div>
                    <div class="years-content">
                        xxx
                    </div>
                </div>

                <div class="experience-years">
                    <div class="years">
                        2007—2013
                    </div>
                    <div class="years-content">
                        诗歌朗诵县一等奖
                    </div>
                </div>

                <div class="experience-years">
                    <div class="years">
                        2013—2016
                    </div>
                    <div class="years-content">
                        征文比赛校一等奖</br>

                    </div>
                </div>

                <div class="experience-years">
                    <div class="years">
                        2016—2019
                    </div>
                    <div class="years-content">
                        三好学生

                    </div>
                </div>

                <div class="experience-last">
                    <div class="years">
                        2019—至今
                    </div>
                    <div class="years-content">
                        第十七届“博创杯”全国大学生嵌入式人工智能设计大赛三等奖</br>
                        参赛作品软件项目申请软件著作权《基于arduino的自动避障规划小车的软件实现系统V1.0》</br>
                        参加互联网+创新创业大赛《掌上食堂app的可行性研究》
                        
                    </div>
                </div>

            </div>

    </section>



    <section id='project'>

        <div>
            <div style="position: relative;">
                <div class="O-background"></div>
                <div class="proj-picture">
                    <img src="images/yiqingquan.png" alt="项目的DEMO图" style="width: 100%;height: 100%;">
                </div>
                <div id="project1" class="projects">
                    <div class="div-proj-div">
                        <div class="project-img">
                            <div><img src="images/yiqingbing.png" alt="项目的LOGO图" class="proj-img"></div>
                        </div>
                    </div>
                    <di class="project-all">

                        <div class="proj1">
                            <div class="project-head">新冠肺炎疫情平台</div>

                            <div class="project-time">2021.01 - 2021.02</div>
                        </div>

                        <div class="proj2">
                            <div class="project-role">爬虫，大数据可视化</div>
                            <div class="line"></div>
                            <div class="project-organization">山西农业大学</div>
                        </div>

                        <div class="project-content">

                            基于python爬虫实时爬取当前全国各省市疫情数据，存入数据库中，应用apache echarts将数据在web页面可视化</br>
                            </br>
                            本工程使用普通线性回归模型，使用全国地图模型进行计算初始化参数。</br>
                            </br>
                            

                        </div>

                        <div class="proj3">

                            <div class="project-tag0">Python</div>
                            <div class="line"></div>
                            <div class="project-tag">java</div>
                            <div class="line"></div>
                            <div class="project-tag">数据可视化</div>

                        </div>
                </div>
            </div>
        </div>

        <div>
            <div style="position: relative;">
                <div class="E-background"></div>
                <div class="proj-picture">
                    <img src="images/xczx.JPG" alt="项目的DEMO图" style="width: 100%;height: 100%;">
                </div>
                <div id="project2" class="projects">
                    <div class="div-proj-div">
                        <div class="project-img">
                            <div><img src="images/xczx.JPG" alt="项目的LOGO图" class="proj-img"></div>
                        </div>
                    </div>
                    <di class="project-all">

                        <div class="proj1">
                            <div class="project-head">学成在线</div>

                            <div class="project-time">2021.12 - 2021.12</div>
                        </div>

                        <div class="proj2">
                            <div class="project-role">逻辑设计、开发、测试</div>
                            <div class="line"></div>
                            <div class="project-organization">山西农业大学</div>
                        </div>

                        <div class="project-content">

                            <b>Gitee仓库：<a href="https://gitee.com/lsyanling/exploring-the-universe">https://gitee.com/lsyanling/exploring-the-universe</a></b></br>
                            <b><a href="https://lsyanling.gitee.io/exploring-the-universe-build/">查看Demo</a></b>
                            </br>
                            </br>

                            一个纯HTML、CSS开发的学习网站页面</br>


                        </div>

                        <div class="proj3">

                            <div class="project-tag0">Cocos Creator</div>
                            <div class="line"></div>
                            <div class="project-tag">TypeScript</div>
                            <!-- <div class="line"></div>
                            <div class="project-tag">JavaScript</div> -->

                        </div>
                </div>
            </div>
        </div>

        <div>
            <div style="position: relative;">
                <div class="O-background"></div>
                <div class="proj-picture">
                    <img src="images/pyShopping.JPG" alt="项目的DEMO图" style="width: 100%;height: 100%;">
                </div>
                <div id="project1" class="projects">
                    <div class="div-proj-div">
                        <div class="project-img">
                            <div><img src="images/pyShopping.JPG" alt="项目的LOGO图" class="proj-img"></div>
                        </div>
                    </div>
                    <di class="project-all">

                        <div class="proj1">
                            <div class="project-head">品优购</div>

                            <div class="project-time">2022.02 - 2022.03</div>
                        </div>

                        <div class="proj2">
                            <div class="project-role">个人项目</div>
                            <div class="line"></div>
                            <div class="project-organization">山西农业大学</div>
                        </div>

                        <div class="project-content">

                            <b>Gitee仓库：<a href="https://gitee.com/lsyanling/html-restaurant-game">https://gitee.com/lsyanling/html-restaurant-game</a></b></br>
                            <b><a href="http://lsyanling.gitee.io/html-restaurant-game/">查看Demo</a></b>
                            </br>
                            </br>

                            一个纯HTML、CSS、JavaScript开发的网上商城页面，包含简单的点击交互和动画效果；</br>
                            </br>
                            包括轮播图、商品放大镜和购物车效果。

                        </div>

                        <div class="proj3">

                            <div class="project-tag0">HTML</div>
                            <div class="line"></div>
                            <div class="project-tag">CSS</div>
                            <div class="line"></div>
                            <div class="project-tag">JavaScript</div>

                        </div>
                </div>
            </div>
        </div>

        <div>
            <div style="position: relative;">
                <div class="E-background"></div>
                <div class="proj-picture">
                    <img src="images/p2.png" alt="项目的DEMO图" style="width: 100%;height: 100%;">
                </div>
                <div id="project1" class="projects">
                    <div class="div-proj-div">
                        <div class="project-img">
                            <div><img src="images/p3.png" alt="项目的LOGO图" class="proj-img"></div>
                        </div>
                    </div>
                    <di class="project-all">

                        <div class="proj1">
                            <div class="project-head">网站搭建与建设</div>

                            <div class="project-time">2022.07 - 2021.08</div>
                        </div>

                        <div class="proj2">
                            <div class="project-role">个人项目</div>
                            <div class="line"></div>
                            <div class="project-organization">个人网站搭建</div>
                        </div>

                        <div class="project-content">

                            <b>Gitee仓库：<a href="https://gitee.com/lsyanling/html-resume">https://gitee.com/lsyanling/html-resume</a></b></br>
                            <b><a href="http://lsyanling.gitee.io/html-resume/">查看Demo</a></b>
                            </br>
                            </br>

                            在阿里云上购买云服务器，进行配置与搭建，利用HTML/CSS/JavaSvript进行页面的开发，进行域名的注册，使所有人都可以访问我的主页
                            

                        </div>

                        <div class="proj3">

                            <div class="project-tag0">HTML</div>
                            <div class="line"></div>
                            <div class="project-tag">CSS</div>
                            <div class="line"></div>
                            <div class="project-tag">JavaScript</div>

                        </div>
                </div>
            </div>
        </div>

    </section>

    <section class='interact'>

        <div class='interact-atlas'>

            <div class='atlas-first-row'>

                <div class='interact-atlas-pic'>

                    <p>请给我点赞</p>

                    <div class='redheart-box' id='box1'>

                        <img src='images/whiteheart.png' class='whiteHeart'>

                        <img src='images/redheart.png' class='redHeart' id='redheart1'>

                        <img src='images/redheart.png' class='flyHeart' id='flyheart1'>

                    </div>

                </div>

                <div class='interact-atlas-pic'>

                    <p>Please</p>

                    <div class='redheart-box' id='box2'>

                        <img src='images/whiteheart.png' class='whiteHeart'>

                        <img src='images/redheart.png' class='redHeart' id='redheart2'>

                        <img src='images/redheart.png' class='flyHeart' id='flyheart2'>

                    </div>
                </div>
                <div class='interact-atlas-pic'>

                    <p>baidu</p>

                    <div class='redheart-box' id='box3'>

                        <img src='images/whiteheart.png' class='whiteHeart'>

                        <img src='images/redheart.png' class='redHeart' id='redheart3'>

                        <img src='images/redheart.png' class='flyHeart' id='flyheart3'>

                    </div>

                </div>

                <div class='interact-atlas-pic'>

                    <p>baidu</p>

                    <div class='redheart-box' id='box4'>

                        <img src='images/whiteheart.png' class='whiteHeart'>

                        <img src='images/redheart.png' class='redHeart' id='redheart4'>

                        <img src='images/redheart.png' class='flyHeart' id='flyheart4'>

                    </div>

                </div>

            </div>

            <div class='atlas-second-row'>

                <div class='interact-atlas-pic'>

                    <p>baidu</p>

                    <div class='redheart-box' id='box5'>

                        <img src='images/whiteheart.png' class='whiteHeart'>

                        <img src='images/redheart.png' class='redHeart' id='redheart5'>

                        <img src='images/redheart.png' class='flyHeart' id='flyheart5'>

                    </div>

                </div>

                <div class='interact-atlas-pic'>

                    <p>baidu</p>

                    <div class='redheart-box' id='box6'>

                        <img src='images/whiteheart.png' class='whiteHeart'>

                        <img src='images/redheart.png' class='redHeart' id='redheart6'>

                        <img src='images/redheart.png' class='flyHeart' id='flyheart6'>

                    </div>

                </div>

                <div class='interact-atlas-pic'>

                    <p>baidu</p>

                    <div class='redheart-box' id='box7'>

                        <img src='images/whiteheart.png' class='whiteHeart'>

                        <img src='images/redheart.png' class='redHeart' id='redheart7'>

                        <img src='images/redheart.png' class='flyHeart' id='flyheart7'>

                    </div>

                </div>

                <div class='interact-atlas-pic'>

                    <p>baidu</p>

                    <div class='redheart-box' id='box8'>

                        <img src='images/whiteheart.png' class='whiteHeart'>

                        <img src='images/redheart.png' class='redHeart' id='redheart8'>

                        <img src='images/redheart.png' class='flyHeart' id='flyheart8'>

                    </div>

                </div>

            </div>

        </div>

        <div class='interact-message' id='interact'>

            <h1>留言板</h1>

            <div class='interact-message-content'>

                <div class='interact-message-content-block' id='firstBox'>

                    <div class='personal-information'>

                        <div class='header-pic'>

                            <p>W</p>

                        </div>

                        <p class='personal-name'>WANG</p>

                    </div>

                    <div class='personal-message'>

                        <p>这个人很懒，什么也没说</p>

                    </div>

                </div>

                <div class='interact-message-content-block'>

                    <div class='personal-message'>
                        <p>这个人也很懒，什么也没说</p>
                    </div>

                    <div class='personal-information'>

                        <div class='header-pic'>

                            <p style="margin: 0px;">L</p>

                        </div>

                        <p class='personal-name'>lsyanling</p>

                    </div>

                </div>

                <div class='interact-message-content-block' id='firstBox'>

                    <div class='personal-information'>

                        <div class='header-pic'>

                            <p>W</p>

                        </div>

                        <p class='personal-name'>WANG</p>

                    </div>

                    <div class='personal-message'>

                        <p>这个人更懒，什么也没说</p>

                    </div>

                </div>


            </div>

            <div class='interact-message-speaking'>

                <input id='message-input' type='text' placeholder="很遗憾，留言板未完工">

                <div id='input-block'>

                    <input id='name-input' type='text' placeholder="在这里输入您的名字">

                    <input id='message-submit' type='submit' value='发表'>

                </div>

            </div>

        </div>

    </section>

    <footer>
        <p>你好呀</p>
        <p>谢谢阅读</p>
    </footer>

    <script src="advancedresume.js"></script>
</body>

</html>